<template>
  <view class="address">
    <view class="section">
      <view class="icon"><uni-icons type="person"></uni-icons></view>
      <view class="detail">
        <view class="person">
          <text class="name">{{ receiver.addressee }}</text>
          <text class="phone">{{ receiver.phone }}</text>
          <view class="addr">{{ assembleAddress(receiver) }}</view>
        </view>
      </view>
    </view>
  </view>
</template>
<script setup lang="ts">
import {assembleAddress} from "@/utils/str";
import {AddressItemCls} from "@/pagesOrder/types/usercls";

// props接受的类型校验要是class类型，interface或type类型在不支持
defineProps({
  receiver: AddressItemCls
})

</script>
<style lang="scss">
.address {
  background-color: #fff;
  padding: 10px 20px;
  font-size: 14px;
  .section {
    display: flex;
    align-items: center;
    .person {
      margin-left: 10px;
      .phone {
        margin-left: 10px;
      }
      .addr {
        color: $uni-text-color-grey;
      }
    }
    .detail {
      margin-left: 10px;
    }
  }
}
</style>